<template>
  <div class="commentItem">
      <!-- 再次渲染可能存储的上一级评论 -->
      <mycommentItem :parent='parent.parent' v-if='parent.parent'></mycommentItem>
      <div class="top">
          <div class="left">
              <span>{{parent.user.nickname}}</span> &nbsp;&nbsp;&nbsp;
              <span>2分钟前</span>
          </div>
          <span>回复</span>
      </div>
      <div class="bottom">{{parent.content}}</div>
  </div>
</template>

<script>
// import ci from '@/components/commentItem.vue'
export default {
    // 如果为组件设置了name属性，那么这个name属性就相当于注册了当前组件，你可以直接使用
  name:'mycommentItem',
  props:['parent']
}
</script>

<style lang='less' scoped>
    .commentItem{
        border: 1px solid #ccc;
        padding: 3px;
        margin-top: 2px;
        .top{
            font-size: 12px;
            color: #aaa;
            display: flex;
            justify-content: space-between;
        }
        .bottom{
            font-size: 13px;
            line-height: 40px;
        }
    }
</style>